{extend name="public/base" /}
{block name="title"}标签管理{/block} {block name="main"}


<form class="layui-form">
    <table cellspacing="0" cellpadding="0" border="0" style="width: 100%;" class="layui-table">
        <thead>
            <tr>
                <th>ID</th>
                <th>标签名称</th>
                <th>排序</th>
                <th style="width: 80px;">状态</th>
            </tr>
        </thead>
        <tbody id="JS_box">
            {if condition="$data['msg']"}
                <tr class="td_center"><td colspan="10">{$data['msg']}</td></tr>
            {/if}
            {volist name="data" id="item"}            
            <tr class="nodelist depth01" data-id="{$item['id']}" data-name="{$item['tagname']}">
                <td class="td_left">
                    <div class="layui-table-cell ">{$item['id']}</div>
                </td>                
                <td class="td_left JS_edit">
                    <div class="layui-table-cell ">{$item['tagname']}</div>
                    <input style="display: none;" value="{$item['tagname']}" class="layui-input layui-table-edit JS_edit_input" />
                </td>
                <td class="td_left">
                    <div class="layui-table-cell ">
                        <div class="layui-btn-group">
                        <a href="javascript:;"  {$key==0 ? 'style="display: none;"':''} class="layui-btn layui-btn-sm JS_up">上移</a>
                        <a href="javascript:;" {$key+1 == count($data) ? 'style="display: none;"':''} class="layui-btn layui-btn-sm JS_down">下移</a>
                        
                        </div>
                    </div>
                </td>
                <td class="td_left">
                    <div class="layui-table-cell layui-inline" style="height:auto;">
                        <input class="JS_status" lay-filter="status" type="checkbox" {$item[ 'status']==1? 'checked': ''} data-id="{$item['id']}" lay-skin="switch" lay-text="正常|关闭">
                    </div>
                </td>
            </tr>
            {/volist}
        </tbody>
    </table>
    <div style="text-align: right; padding-right: 20px;">
        <a href="javascript:;" id="JS_addTags" class="layui-btn layui-btn-normal layui-btn-sm">新增标签</a>
        <a href="javascript:;" id="JS_close" class="layui-btn layui-btn-primary layui-btn-sm">关闭</a>
        <a href="javascript:;" id="JS_save" class="layui-btn layui-btn-sm">保存修改</a>
    </div>
</form>

{/block}

{/block} {block name="script"}
<style>
.childrenBody{
    padding-top: 0px;
}
.JS_edit{
    cursor:text;
}


</style>
<script>

layui.use(['form','common'], function (form) {
    
    
    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
    
    var closeFunc = function(){
        var data = new Array();
        $.each( $('#JS_box tr'),function(k,val){
            if( $(this).find('.JS_status').attr("checked") ){
                var li = {
                    id : $(this).data('id'),
                    tagname: $(this).data('name'),
                    status : $(this).find('.JS_status').attr("checked")?1:2
                }
                data.push(li);
            }            
        });        
        if(typeof parent.window.tagsCall == 'function'){
            parent.window.tagsCall(data);
        }
        parent.layer.close(index);
    }
    
    $('#JS_close').on('click',function(){
        closeFunc();
    });
    
    // 保存
    $('#JS_save').on('click',function(){
        var data = new Array();
        $.each( $('#JS_box tr'),function(k,val){
            var li = {
                id : $(this).data('id'),
                tagname: $(this).data('name'),
                status : $(this).find('.JS_status').attr("checked")?1:2
            }
            data.push(li);
        });
        $.post('/set/tags/editall',{data:data},function(ret){
            if(ret.code==1){
                closeFunc();                
            }else{
                layui.common.error(ret.msg);
            }
        },'json');
    });
    
    $('#JS_addTags').on('click',function(){
        layer.prompt({title: '输入标签名称'},function(val, index){
            $.post("/set/tags/add",{tagname:val},function(ret){
                 window.location.reload();
            });
            layer.close(index);
        });
    });
    
    // 移动操作
    var clickMove = function(e,type){
        var box = '#JS_box';
        var ThisID = e.data('id');
        var box_list = $(box + ' tr');
        var lenght = box_list.length;
        var checkMove = function(){
            var ret = true;
            $.each( box_list ,function(k,value){
                var tId = $(this).data('id');
                if( tId == ThisID ){
                    if( type == 'up' && k == 0 ){
                        ret = false;
                        return;
                    }
                    if( type == 'down' && lenght-1 == k ){
                        ret = false;
                        return ;
                    }
                }
            });
            return ret;
        }
        if (!checkMove()) return false;
        var temp = e.clone();
        if( type == 'up'){
            e.prev().before(temp);
        }else{
            e.next().after(temp);            
        }
        e.remove();
        $.each( $(box + ' tr') ,function(k,value){
            $(this).find('.layui-btn-group a').show();
            if( k == 0 ) $(this).find('.JS_up').hide();
            if( lenght -1  == k ) $(this).find('.JS_down').hide();
        });
        form.render(); //更新全部
    }
    $("#JS_box").delegate(".JS_up","click",function(){
        clickMove($(this).parents('tr'),'up');
    });
    $("#JS_box").delegate(".JS_down","click",function(){
        clickMove($(this).parents('tr'),'down');
    });
    
    // 编辑 
    $("#JS_box").delegate(".JS_edit","click",function(){
        var v = $(this).find('input').val();
        $(this).find('input').show().focus().val('').val(v);
    });
    $("#JS_box").delegate(".JS_edit_input","blur",function(){
        $(this).hide();
        var v = $(this).val();
        $(this).parents('td').find('.layui-table-cell').text(v);
        $(this).parents('tr').data('name',v);
    });
    
    
});

</script> {/block}